<template>
    <div class="virtual_member_use_detail">

        <el-card shadow="never" class="card-com">
            <div class="card-1">
                <searchPanel @refresh="getData('reset')" @changePanel="resizeWin">
                    <!-- 查询面板 -->
                    <template v-slot:search>
                   
                    </template>
                    <!-- 字段添加 -->
                    <template v-slot:edit>
                      
                    </template>
                </searchPanel>
            </div>
            <div class="card-2">
                <!-- table数据 -->
              <h1>虚拟会员明细</h1>
            </div>
        </el-card>
   
    </div>
</template>

<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { onMounted, ref, nextTick, onUnmounted, defineAsyncComponent } from 'vue';
import { Search, Plus, Refresh, Download } from '@element-plus/icons-vue'

import _ from "lodash"





onMounted(() => {
    nextTick(() => {
        const dom1 = document.querySelector(".card-1") as any;
        const dom2 = document.querySelector(".card-com") as any;
        if (dom2) {
            const height = dom2.offsetHeight - dom1.offsetHeight - 70;
            // pageParams.value.tableHeight = height;
        }
    })
    window.addEventListener('resize', resizeWin)
})
onUnmounted(() => {
    window.removeEventListener('resize', resizeWin)
})
const resizeWin = _.debounce(() => {
    const dom1 = document.querySelector(".card-1") as any;
    const dom2 = document.querySelector(".card-com") as any;
    if (dom2) {
        const height = dom2.offsetHeight - dom1.offsetHeight - 70;
        // pageParams.value.tableHeight = height;
    }
}, 200)
const getData = (type: string) => {
    // getDate1(type)
}
</script>

<style scoped lang="scss">
.virtual_member_use_detail {
    display: flex;
    height: calc(100vh - 70px);

    .card-com {
        flex-grow: 1;
    }
}
</style>